import { createRouter, createWebHashHistory, createWebHistory, RouteRecordRaw } from 'vue-router'
import Login from "./pages/Login.vue";
import Home from './pages/Home.vue';

import { filterMenusOrRoutes } from './utils/filterMenu';
import { useGlobalStore } from './store/global';
import { KeepAlive } from 'vue';

// 动态路由
type RouteItem = RouteRecordRaw & {roles?:string[]}
export const dynamicRouter:RouteItem[]= [
  { path: 'echart',component:()=>import('./pages/Nav/Echart.vue') },
  { path: 'userManage',name:'userManage', component: () => import('./pages/Nav/userManage.vue'),meta:{name:'用户管理'}},
  { path: 'roleManage',name:'roleManage', component: () => import('./pages/Nav/roleManage.vue'),meta:{name:'角色管理'} },
  { path: 'menuManage', name:'menuManage',component: () => import('./pages/Nav/menuManage.vue'),meta:{name:'菜单管理'} },
  { path: 'rangeList',name:'rangeList', component: () => import('./pages/Nav/rangeList.vue'),meta:{name:'靶场列表'} ,
  children:
  [{path:'newList',name:'newList',meta:{name:'新增靶场',keepAlive:true,},component:()=>import("./pages/Nav/newList.vue")},
  { path: 'makeList',name:'makeList',component:()=>import("./pages/Nav/makeList.vue"),meta:{name:'编辑靶场'}},
  
]},
  { path: 'center',name:'center', component: () => import('./pages/Nav/center.vue') },
  { path: 'updataPassword',name:'updataPassword', component: () => import('./pages/Nav/updataPassword.vue') },
  { path: '/:pathMatch(.*)*', name: 'NotFound', component: () => import('./pages/NotFound.vue')},
  { path: 'wang',name:'wang',component:()=>import("./pages/Nav/wang.vue"),meta:{name:'添加靶场'} } 
]



const routes = [
  { path: '/', redirect: "/login" },
  { path: '/login', component: Login },
  {
    path: '/home', component: Home,
    //动态路由，addRoute 第一个参数名字
    name:'home',
    children: dynamicRouter,
  },
]
export const router = createRouter({
  history: createWebHistory(),
  routes: routes,
})




/**
 * 利用addRoute动态配置路由
 * routes：是过滤之后的路由数组
 * 
 */
// export function initRoutes(routes:RouteItem[]){
//    //重置路由
//    dynamicRouter.forEach(item=>{
//     //确认是否存在指定名称的路由。 hasRoute
//     // 判断动态路由是否存在name，存在相同的name，则不添加
//     if(router.hasRoute(item.name as string)){
//         router.removeRoute(item.name as string);
//     }
    
// })
//     // 遍历动态路由
//     routes.forEach(item=>{
//         //添加  addRoute 第一个参数：一级路由 ；第二个参数：二级路由配置
//           router.addRoute('home',item)       
//     })
// }

// const userInfo = localStorage.userInfo? JSON.parse(localStorage.userInfo):{}
// initRoutes(filterMenusOrRoutes(dynamicRouter,userInfo.role))






// 路由守卫
// const whiteList = ['/', '/login'] //白名单
// router.beforeEach((to, from, next) => {
//   console.log('to', to);
//   console.log('from', from);
//   const token = localStorage.token
//   //从from 的白名单路径 到to不是白名单路径，判断是否存在token，token是否为真
//   if (whiteList.includes(from.path) && !whiteList.includes(to.path)) {
//     //判断token是否存在
//     if (!token) {
//       next('./login')
//     } else {
//       const globalStore = useGlobalStore()
//       globalStore.changeLoading(true)
//       //判断token是否为真
//       getUserInfoApi()
//         .then(() => {
//           globalStore.changeLoading(false)
//           next()
//         })
//         .catch(() => {
//           // 这里在fetch第一层封装里面有处理
//           //token是假的
//           globalStore.changeLoading(false)
//         })
//     }
//   } else {
//     next()
//   }

// })

